<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>材料管理</title>
    <!-- 引入其它组件 -->
    <!-- 引入 layui -->
    <link rel="stylesheet" href="/layui/css/layui.css">
    <link rel="stylesheet" href="/css/app.css">
</head>

<body>
    <div class="container">
        <div class="table-container">
            <div class="table-wrapper">
                <table class="layui-table" lay-size="sm" id="table4a">
                </table>
            </div>
        </div>
        <!-- 关闭按钮 -->
        <div class="btn-container" style="text-align: center;">
            <button class="layui-btn layui-btn-primary" type="button" id="btn-close">关闭</button>
        </div>
    </div>

    <script src="/js/config/api.js"></script>
    <script src="/js/http.js"></script>
    <script src="/layui/layui.js"></script>
    <script src="/js/utils.js"></script>

    <script>
        layui.use(['table', 'layer'], function () {
            var table = layui.table;
            var layer = layui.layer;
            var $ = layui.$;
             var bsm_utils = layui.bsm_utils;

            var taxRate = 0.13;
            var designCode = getUrlParam("design_code");
            var designType = parseInt(getUrlParam("design_type"));

            // 全局数据存储（同步方式核心）
            var tableData = [];
            var user = localStorage.getItem('user');
            user = JSON.parse(user);
            var orgCode = user.org_code;

            // 表格渲染后调整
            table.on('done(table4a)', function () {
                setTimeout(function () {
                    bsm_utils.notifyParentResize({
                        minWidth: 800,
                        minHeight: 600
                    });
                }, 300);
            });

            // 初始化表格（纯同步方式）
            function initTable() {
                table.render({
                    elem: '#table4a',
                    data: tableData, // 直接使用本地数据
                    cols: [
                        [
                            { type: 'numbers', title: '序号', width: "60", align: 'center', colspan: 1, rowspan: 2 },
                            { field: 'code', title: '材料编码', width: 120, align: 'center', colspan: 1, rowspan: 2, totalRowText: '合计' },
                            { field: 'name', title: '规格', width: 200, colspan: 1, rowspan: 2 },
                            { field: 'unit', title: '单位', align: 'center', width: 72, colspan: 1, rowspan: 2 },
                            { field: 'quantity', title: '数量', width: 72, edit: 'text', colspan: 1, rowspan: 2 },
                            { title: '单价（元）', align: 'center', colspan: 3, rowspan: 1, },
                            { title: '合计（元）', align: 'center', colspan: 3, rowspan: 1, },
                            { field: 'remark', title: '备注', width: 100, edit: 'text', rowspan: 2, colspan: 1 },
                            { title: '操作', width: "80", toolbar: '#table4a-bar', rowspan: 2, colspan: 1 },
                        ],
                        [
                            {
                                field: 'price', title: '除税价', width: 80,
                                templet: function (d) { return moneyTemplet(d, 'price'); }
                            },
                            {
                                field: 'tax', title: '增值税', width: 80,
                                templet: function (d) { return moneyTemplet(d, 'tax'); }

                            },
                            {
                                field: 'tax_price', title: '含税价', width: 80,
                                templet: function (d) { return moneyTemplet(d, 'tax_price'); }
                            },
                            {
                                field: 'money', title: '除税金额', width: 100, totalRow: true,
                                templet: function (d) { return moneyTemplet(d, 'money'); }
                            },
                            {
                                field: 'money_tax', title: '增值税', width: 100, totalRow: true,
                                templet: function (d) { return moneyTemplet(d, 'money_tax'); }
                            },
                            {
                                field: 'money_total', title: '含税金额', width: 100, totalRow: '{{= (d.TOTAL_NUMS || 0).toFixed(2) }}',
                                templet: function (d) { return moneyTemplet(d, 'money_total'); }
                            },
                        ],
                    ],
                    totalRow: true,
                    done: function () {
                    }
                });
            }


            // 更新保存状态显示
            function updateSaveStatus() {
                var $status = $('#save-status');
                if (hasUnsavedChanges) {
                    $status.show().find('.status-indicator')
                        .removeClass('status-saved')
                        .addClass('status-unsaved')
                        .next('span').text('未保存');
                } else {
                    $status.show().find('.status-indicator')
                        .removeClass('status-unsaved')
                        .addClass('status-saved')
                        .next('span').text('已保存');
                }
            }

            // 金额格式化模板函数
            function moneyTemplet(d, field) {
                if (!d || !d.hasOwnProperty(field)) {
                    return '0.000';
                }

                // 确保是数字类型
                let value = d[field];
                if (typeof value === 'string') {
                    value = parseFloat(value) || 0;
                }

                // 格式化显示
                return value.toFixed(3);
            }

            // 加载初始数据（同步方式）
            function loadData() {
                var loading = layer.load();

                http.get(API_CONFIG.ENDPOINTS.LOAD_MATERIAL, {
                    design_code: designCode,
                    design_type: designType
                }).then(function (res) {
                    layer.close(loading);

                    if (res.code === 0 && res.data) {
                        // 处理并保存到全局数据
                        tableData = res.data.map(function (item) {
                            return processItem(item);
                        });

                        // 重新渲染表格
                        table.reloadData('table4a', {
                            data: tableData
                        });

                    } else {
                        tableData = [];
                    }
                }).catch(function (err) {
                    layer.close(loading);
                    layer.msg('加载失败', { icon: 2 });
                    tableData = [];
                });
            }

            function processItem(item) {
                // 使用更精确的计算方式
                item.price = Math.round(parseFloat(item.price || 0) * 1000000) / 1000000;
                item.quantity = Math.round(parseFloat(item.quantity || 0) * 1000000) / 1000000;
                item.tax = Math.round(item.price * taxRate * 1000000) / 1000000;
                item.tax_price = Math.round(item.price * (1 + taxRate) * 1000000) / 1000000;
                item.money = Math.round(item.quantity * item.price * 1000000) / 1000000;
                item.money_tax = Math.round(item.money * taxRate * 1000000) / 1000000;
                item.money_total = Math.round((item.money + item.money_tax) * 1000000) / 1000000;

                if (!item._id) {
                    item._id = (item.code || '') + '_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9);
                }
                return item;
            }

            // 工具函数
            function getUrlParam(name) {
                var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
                var r = window.location.search.substr(1).match(reg);
                return r ? decodeURIComponent(r[2]) : null;
            }

            // 初始化执行
            initTable();
            loadData();

            $('#btn-close').click(function () {
                var index = parent.layer.getFrameIndex(window.name);
                parent.layer.close(index);
            });
        });
    </script>
</body>

</html>